.wrapper {
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;

  .background {
    width: 100%;
    height: 100%;
    flex-shrink: 0;
    border-radius: 4px;
    background: #e7edfe;
    position: relative;

    &::after {
      content: '';
      position: absolute;
      inset: -100%;
      background: linear-gradient(
        134deg,
        rgba(255, 255, 255, 0) 30%,
        rgba(255, 255, 255, 0.7),
        rgba(255, 255, 255, 0) 70%
      );
      animation: shark-wrap 2s infinite;
      transform: translateX(-100%);
    }

    .icon {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
  }

  @keyframes shark-wrap {
    to {
      transform: translateX(100%);
    }
  }

  img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
  }

  .text {
    display: flex;
    padding: 2px 6px;
    align-items: center;
    gap: 4px;
    position: absolute;
    left: 8px;
    bottom: 11px;
    border-radius: 4px;
    background: var(--fill-color-bg-white, #fff);
    color: var(--, #514df0);
    font-family: 'PingFang SC';
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px; /* 166.667% */
    letter-spacing: 0.036px;
  }
}

.img-risk {
  border-radius: 4px;
  width: 100%;
  height: 100%;
  background: var(--light-fill-color-fill-2, #f2f3f5);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: calc(50% - 50px);
  position: relative;

  .risk-text {
    color: var(--light-text-color-text-3, #86909c);
    font-family: 'PingFang SC';
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px; /* 157.143% */
    letter-spacing: 0.042px;
  }
}
